<form class="form-inline">
  <div class="form-group">
    <label class=" control-label">开始日期</label>

    <div class="input-group date form_datetime">
      <span class="input-group-addon">
        <i class="fa fa-calendar"></i>
      </span>
      <input class="form-control" type="text" style="background: white; cursor: pointer;" [(ngModel)]="getBody.sBegin" mwlFlatpickr
        [ngModelOptions]="{standalone: false}" name="sBegin" id="sBegin">
    </div>

    <label class=" control-label">结束日期</label>

    <div class="input-group date form_datetime">
      <span class="input-group-addon">
        <i class="fa fa-calendar"></i>
      </span>
      <input class="form-control" type="text" style="background: white; cursor: pointer;" [(ngModel)]="getBody.sEnd" mwlFlatpickr
        [ngModelOptions]="{standalone: false}" name="sEnd" id="sEnd">
    </div>
    <button type="button" class="btn btn-primary" (click)="loadList()">
      <i class="fa fa-search"></i>查询</button>
    <button type="button" class="btn btn-primary" (click)="export()">
      <i class="fa fa-sign-out"></i>导出Excel</button>

  </div>

</form>
<div style="overflow-x:scroll;">
  <p class="pull-right">统计：流出总值：{{nOutflowAmountTotal}}元，流入总值：{{nInflowAmountTotal}}元</p>
  <table id="example2" class="datatable-control-all table table-bordered table-keep-line table-hover table-striped">
    <thead>
      <tr>
        <th class="width-5">
          <div class="checkbox checkbox-primary">
            <input type="checkbox" id="checkboxAll" [(ngModel)]="isCheckedAll" (ngModelChange)="checkedAll()">
            <label></label>
          </div>
        </th>
        <th class="width-12">持仓日期</th>
        <th class="width-12">组合代码</th>
        <th class="width-12">组合名称</th>
        <!-- updated by dujh @20180703 start -->
        <!-- <th class="width-12">业务类型</th> -->
        <!-- updated by dujh @20180703 end -->
        <th class="width-12">流入金额（元）</th>
        <th class="width-12">流出金额（元）</th>
        <th class="width-12">份额（元）</th>
        <th class="width-11">资金类型</th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let item of bankrollList" style="text-align: center; vertical-align: middle; ">
        <td>
          <div class="checkbox checkbox-primary">
            <input type="checkbox" [(ngModel)]="item.isChecked" (ngModelChange)="ctrlCheckAll()">
            <label></label>
          </div>
        </td>
        <td class="short_name">{{item.tDate}}</td>
        <td class="short_name">{{item.sFundCode}}</td>
        <td class="short_name">{{item.sFundName}}</td>
        <!-- updated by dujh @20180703 start -->
        <!-- <td class="short_name">{{item.sFundType}}</td> -->
        <!-- updated by dujh @20180703 end -->
        <td class="short_name">{{item.nInputMoney}}</td>
        <td class="short_name">{{item.nOutputMoney}}</td>
        <td class="short_name">{{item.nMoney}}</td>
        <!--updated by dujh @20180703 start-->
        <td class="short_name">{{item.nCashTypeZh}}</td>
        <!-- updated by dujh @20180703 end -->
      </tr>
    </tbody>
  </table>
</div>
<div class="box-footer clearfix">
  <app-pagination [currentPageNum]="bankrollListPageInfo.currentPageNum" [pagesShow]="" [totalPages]="bankrollListPageInfo.totalPages"
    (pageChanged)="bankrollPageNavigation($event)">
    <div class="pull-left pagination-detail" data-pagination-additional="true">
      <span class="pagination-info">
        当前显示第{{bankrollListPageInfo.startRow}}到第{{bankrollListPageInfo.endRow}}条，总共{{bankrollListPageInfo.total}}条，
      </span>
      <span class="page-list">
        每页记录
        <span class="btn-group dropup">
          <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
            <span class="page-size">{{bankrollListPageInfo.pageSize}}</span>
            <span class="caret"></span>
          </button>
          <ul class="dropdown-menu" role="menu">
            <li *ngFor="let i of bankrollListPageInfo.pageList" role="menuitem" [class.active]="bankrollListPageInfo.pageSize === i"
              (click)="bankrollpageSizeChange(i)">
              <a>{{i}}</a>
            </li>
          </ul>
        </span>条
      </span>
    </div>
  </app-pagination>
</div>